쿠키 , 세션 , 웹스토리지

먼저 HTTP 프로토콜에 대해

HTTP는 인터넷 상에서 데이터를 주고 받기 위한 서버/클라이언트 모델을 따르는 프로토콜이다.

기본적으로 HTTP 프로토콜은 비연결성지향 , 무상태의 성질을 가지고있음 그렇기때문에 서버는 클라이언트를 구별할 수 없다.

비연결성지향(connectionless)

• http는 먼저 클라이언트가 요청을 서버에 보내면, 서버는 클라이언트에게 요청에 맞는 응답을 보내고 TCP/IP 연결을 끊는 특성이다.

무상태(stateless)

• 연결을 귾는 순간 클라이언트와 서버의 통신이 끝나며 상태 정보를 유지하지않는 특성이다.

여담 stateful -> 연결이 지속되어있는 방식 실시간연결

그렇기 때문에 클라이언트의 로그인 정보나 브라우저에서 입력한 값등이 페이지를 이동할때마다 초기화됨

쿠키

클라이언트 로컬에 저장되는 키와 값 형태의 파일로
이름 값 만료시간 경로정보등이 저장되어있다.

• 클라이언트의 상태 정보를 로컬에 저장했다가 참조한다.
• Response Header 에 set-cookie 속성을 사용하면 클라이언트에 쿠키를 만들 수 있다.
• 만들어진 쿠키는 사용자가 따로 요청하지 않아도 브라우저가 Request 사이에 Request Header 를 넣어서 자동으로 서버에 전송한다.
• 세션관리: 서버에 저장해야할 로그인, 장바구니, 게임 스코어 등의 정보 관리
• 사용자 맞춤: 사용자가 선호하는 옵션이나 테마 등의 세팅
• 사용자 추적: 사용자의 행동을 분석하고 기록하는 용도

세션

• 사용자 정보를 파일 브라우저에 저장하는 쿠키와 달리,
  세션은 서버측에서 관리한다.
• 서버에서 클라이언트를 구분하기 위해 세션 ID 를 부여하며, 웹 브라우저가 서버에 접속해서 브라우저를 종료할 때까지 인증상태를 유지한다.
• 접속 시간에 제한을 두어 일정 시간 응답이 없다면 정보가 유지되지 않게 설정 가능하다.
• 데이터를 서버에 두기 때문에 쿠키보다 보안에 좋지만,
  사용자가 많아질 수록 서버 메모리를 많이 차지하게 된다.

웹스토리지

• 클라이언트(브라우저)에 데이터를 저장할 수 있도록 HTML5 부터 추가된 저장소
• 오리진(Origin)(도메인, 프로토콜, 포트) 단위로 접근이 제한되는 특성 덕분에 CSRF 로부터 안전
• 쿠키보다 큰 저장 용량 지원(모바일 2.5MB, 데스크탑 5~10MB)
• 서버가 HTTP 헤더를 통해 스토리지 객체를 조작할 수 없음(자바스크립트 내에서만 수행가능)